.topic-title {
    padding: $gap;
    margin:$padding;
    font-size: 18px;
    color: $title;
    line-height: 1.5;
    background-color:$colorf0;
    border-radius:$gap;
}

.author-info {
    display: flex;
    align-items: center;
    padding: 0 $padding;
    color: $text;
    font-size: 12px;
    .col {
        display: block;
        width: 100%;
        flex: 1;
    }
    .avatar {
        display: block;
        width: 40px;
        height: 40px;
        margin-right: $padding;
        border-radius: 50%;
    }
    .right{
        text-align: right;
    }
    span, time {
        display: block;
        padding: 5px 0;
    }
    .tag {
        @extend .tag;
        color: #ffffff;
        &.top {
            background: #E74C3C;
        }
        &.ask {
            background: #3498DB;
        }
        &.good {
            background: #E67E22;
        }
        &.job {
            background: #9B59B6;
        }
        &.share {
            background: #1ABC9C;
        }
    }
}
.topic-content {
    padding: $padding;
    margin-top: $padding;
    background: #ffffff;
    border-bottom: solid 1px $colord4;
    .from{
        color:$red;
    }
}
.topic-reply {
    @extend .title;
    padding: $padding;
    border-bottom: solid 1px $colord4;
    strong {
        color: #42b983;
    }
}
.reply_num {
    margin-top: $gap*4;
    background-color: $colore7;
    padding: $gap*2 0 $gap*2 $gap*2;
    border-top: solid 1px $colord4;
    border-bottom: solid 1px $colord4;
}
.reply-list {
    width: 100%;
    margin-top: $gap*3;
    ul {
        width: 100%;
        list-style: none;
        padding-left: 0;
        li {
            width: 100%;
            list-style: none;
            border-bottom: solid 1px $colord4;
            &:last-child {
                border-bottom: none;
            }
            .uped {
                color: $color80;
            }
            .icon {
                font-size: 26px;
            }
            .from{
                color:$red;
            }
            .language-javascript{
                background-color:$colorf0;
                overflow-x:auto;
            }
        }
    }
}

/* 回复框样式 */

.reply {
    margin: 0 $padding;
    textarea {
        display: block;
        width: 100%;
        flex: 1;
        border: $border;
        background-color: #fff;
        font-size: 14px;
        padding: $padding;
        color: #313131;
    }
    .button {
        display: inline-block;
        width: 100%;
        height: 42px;
        margin: $padding 0;
        line-height: 42px;
        color: #fff;
        font-size: 16px;
        background-color: #4fc08d;
        border: none;
        border-bottom: 2px solid #3aa373;
        text-align: center;
        vertical-align: middle;
    }
}



